<template>
	<div class="container">
		<list class="list">
			<cell class="cell" v-for="item in listData" @click="listItemClick(item)">
				<text class="list-item-title">{{item.title}}</text>
				<text class="list-item-subtitle">{{item.subtitle}}</text>
				<div class="divider"></div>
			</cell>
		</list>
	</div>
</template>

<script>
	import {innerModulesListData} from './data/innermodules.js';
	import utils from './utils.js';
	let modal = weex.requireModule('modal');
	let navigator = weex.requireModule('navigator');
	export default {
		data:{
			messages:[],
			listData: innerModulesListData
		},
		methods:{
			click(){
				this.messages.push(new Date())
			},
			listItemClick(item) {
				let link = item.link;
				if (link) {
					navigator.push({
						url: utils.getBaseUrl() + '/dist' + item.link + '?doc=' + item.doc,
						animated: 'true'
					})
				} else {
					navigator.push({
						url: utils.getDocAbsoluteUrl(item.doc),
						animated: true
					})
				}
			}
		}
	}
</script>

<style>
.list-item-title {
	font-size: 35px;
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 25px;
	margin-bottom: 2px;
	color: black;
	font-weight: bold;
}
.list-item-subtitle {
	font-size: 25px;
	margin-left: 20px;
	margin-right: 20px;
	margin-top: 2px;
	margin-bottom: 25px;
	color: #808080;
}
.cell {
	opacity: 1.0;
}
.cell:active {
	opacity: 0.6;
}
.divider {
	height: 1px;
	background-color: #ECECEC;
}
</style>
